﻿@model OSBLE.Models.Intervention.InterventionsList

@{
    string rootUrl = OSBLEPlus.Logic.Utility.StringConstants.WebClientRoot;
    string feedbackUrl = rootUrl + "Intervention/UserFeedback?component=7";
    string availabilityUrl = rootUrl + "Intervention/Availability?component=7";
}

<!doctype html>

<html lang="en">
<head>
    <meta charset="utf-8">

    <title>OSBLE Intervention</title>

    <link rel="stylesheet" type="text/css" href="@Url.Content("~/Content/bootstrap-3.3.5/css/bootstrap.min.css")" />
    <script type="text/javascript" src="@Url.Content("~/Scripts/jquery-2.0.1.min.js")"></script>
    <script type="text/javascript" src="@Url.Content("~/Content/bootstrap-3.3.5/js/bootstrap.min.js")"></script>

    @* highlight.js code syntax highlighting block*@
    <link rel="stylesheet" type="text/css" href="@Url.Content("~/Content/themes/highlight/vs.css")" />
    <script type="text/javascript" src="@Url.Content("~/Scripts/highlight.pack.js")"></script>
    <script>hljs.initHighlightingOnLoad();</script>
    @* highlight.js code syntax highlighting block*@

    <link rel="stylesheet" type="text/css" href="@Url.Content("~/Content/interventions.css")?version=1.0" />
    <script type="text/javascript" src="@Url.Content("~/Scripts/Interventions.js")?version=1.01"></script>    

    <style type="text/css">
        body {
            width: 80%;
            margin-right: auto;
            margin-left: auto;
            margin-top: 2px;
        }

        .panel-heading {
            padding: 2px;
            text-align: center;
        }

        .left {
            float: left;
        }

        .right {
            float: right;
        }

        .center {
            text-align: center;
            margin-left: auto;
            margin-right: auto;
        }

        .panel-body {
            padding: 5px;
        }

        .dismiss-intervention {
            float: right;
            margin-right: 5px;
        }

        .intervention-info {
            float: left;
            margin-left: 5px;
        }

        .panel.panel-primary {
            margin-bottom: 5px;
        }

        .tooltip {
            position: relative;
            display: inline-block;
            border-bottom: 1px dotted black;
        }

            .tooltip .tooltiptext {
                visibility: hidden;
                width: 120px;
                background-color: black;
                color: #fff;
                text-align: center;
                border-radius: 6px;
                padding: 5px 0;
                /* Position the tooltip */
                position: absolute;
                z-index: 1;
                top: -5px;
                right: 105%;
            }

            .tooltip:hover .tooltiptext {
                visibility: visible;
            }

        #dashboard-items span {
            font-size: larger;
            margin-left: 5px;
            margin-right: 5px;
        }
    </style>

</head>

<body class="intervention-body">

    <div class="panel panel-primary" id="dashboard">
        <div class="panel-heading intervention-heading-large">
            <span class="glyphicon glyphicon-time" style="margin-right: 10px; margin-bottom: 5px;"></span>
            Dismissed OSBLE+ Suggestions
        </div>
        <div class="panel-body">
            <table>
                <tr>
                    <td style="text-align: justify; padding: 5px;">
                        Below is a listing of OSBLE+ suggestions which have been 'dismissed' (clicking the 'x' in the upper right of the suggestion on the OSBLE+ Suggestions window).
                        You can revisit any suggestions previously dismissed to either revisit their content/suggestion and/or give additional feedback.
                    </td>
                    <td style="width: 1%; white-space: nowrap; vertical-align: top;">
                        @Html.Partial("_UserFeedbackPrompt", new ViewDataDictionary { { "interventionId", -3 } })
                    </td>
                </tr>
            </table>
        </div>
    </div>

    @foreach (var interventionItem in Model.InterventionItemList) //Populate Suggestion window with interventions.
    {

        <div class="panel panel-primary" id="intervention-@interventionItem.Id">
            <div class="panel-heading center">
                <div class="intervention-heading-large">
                    <span class="glyphicon glyphicon-@interventionItem.Icon1 intervention-info"></span><span class="glyphicon glyphicon-@interventionItem.Icon2 intervention-info"></span>
                </div>
                <div class="center  intervention-heading-large">
                    @interventionItem.Title
                </div>
            </div>
            <div class="panel-body">
                <div class="left">
                    @if (interventionItem.ContentFirst)
                    {
                        <h4>@interventionItem.ListItemContent <a href="@interventionItem.Link">@interventionItem.LinkText</a></h4>
                    }
                    else
                    {
                        <h4><a href="@interventionItem.Link">@interventionItem.LinkText</a> @interventionItem.ListItemContent</h4>
                    }
                    <h4>Suggestion Date: @interventionItem.InterventionDateTime</h4>
                </div>
                <div style="float: right;">
                    @Html.Partial("_UserFeedbackPrompt", new ViewDataDictionary { { "interventionId", interventionItem.Id } })
                </div>
            </div>
        </div>
    }
    @Html.Partial("_SuggestionFeedbackModal")
    <input id="iid" type="hidden" value="-3" />
</body>
</html>